<template>
    <view class="h-552 menu pt-40 ph-24">
        <u-scroll-list indicatorColor="#F0F0F0" indicatorActiveColor="#FABB3C" indicatorWidth="25" indicatorBarWidth="15" :indicatorStyle="{ marginTop: '0' }">
            <view class="f fd-c">
                <view class="f">
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toBusiness">
                        <image src="../../static/serve/xz.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">洗澡</view>
                    </view>
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toBusiness">
                        <image src="../../static/serve/jy.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">绝育</view>
                    </view>
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toBusiness">
                        <image src="../../static/serve/ym.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">疫苗</view>
                    </view>
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toBusiness">
                        <image src="../../static/serve/qc.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">驱虫</view>
                    </view>
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toBusiness">
                        <image src="../../static/serve/xh.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">洗护</view>
                    </view>
                </view>
                <view class="f">
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toBusiness">
                        <image src="../../static/serve/tj.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">体检</view>
                    </view>
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toBusiness">
                        <image src="../../static/serve/th.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">特惠</view>
                    </view>
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toDisease">
                        <image src="../../static/serve/sy.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">摄影</view>
                    </view>
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toBusiness">
                        <image src="../../static/serve/ty.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">托运</view>
                    </view>
                    <view class="f fd-c ai-c menu2-box mb-32 mr-48" @click="toBusiness">
                        <image src="../../static/serve/jy-ico.png" class="w-52 h-52"></image>
                        <view class="mt-16 fs-24 fw-400 text-color6">寄养</view>
                    </view>
                </view>
            </view>
        </u-scroll-list>
        <image
            :src="getBaseUrl() + '/admin-api/system/file/19/get/e21bfb4405c23433a2e1361811d2a9659d50edd87556d71b6969213761fae675.png'"
            class="w-f h-180 mt-8"
        ></image>
    </view>
</template>
<script setup lang="ts">
import { ref } from 'vue';
const menuList = ref<any[]>([]);
import { getBaseUrl } from '@/utils/env';
import { categoryTopList } from '@/services/api/shop/index';
const toBusiness = () => {
    uni.navigateTo({
        url: '/pages_serve/businessList',
    });
};

function getData(data: any) {
    menuList.value = data;
}
//获取顶级分类
async function getCategoryTopList() {
    const { data } = await categoryTopList({ type: 1, spuType: 3 });
	console.log(menuList)
    menuList.value = data;

}
defineExpose({ getCategoryTopList });
</script>

<style lang="scss" scoped>
.menu {
    background: #ffffff;
    border-radius: 24rpx;
    width: 100%;

    .menu2-box {
        width: 96rpx;
    }
}
</style>
